<%--
  Created by IntelliJ IDEA.
  User: Pepsi
  Date: 2021/12/22
  Time: 14:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>ajax-jquery</title>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
        $(function (){
            $("#uname").blur(function (){
                //1、接收输入的数据
                var username= $(this).val();
                //2、发送ajax   传统的方式
                // $.ajax({
                //     url:"/checkname",
                //     type:"post",
                //     data:"username="+username,
                //     dataType:"text",
                //     success:function(res){
                //         $("#rs").html(res)
                //     }
                // });

                //新版的发送ajax请求方法
                $.get("/checkname","username="+username,function (res){
                    $("#rs").html(res)
                })
                // $.post("/checkname","username="+username,function (res){
                //     $("#rs").html(res)
                // })

            });
        })
    </script>
    <style>
        #rs{
            color: green;
        }
    </style>
</head>
<body>
    <h1></h1>
    username:<input type="text" id="uname"><span id="rs"></span>
</body>
</html>
